<template>
<div class="submenu">
<el-menu 
   :default-active="$route.path" 
    class="el-menu-vertical-demo" 
    ref="sideMenu"
   :collapse="$store.state.menuCollapse">
     <qf-sub-menu :sideMenu="$store.state.sideMenu"></qf-sub-menu>
</el-menu>
</div>
</template>
<style>
  .el-menu-vertical-demo:not(.el-menu--collapse) {
    width: 200px;
    min-height: 400px;
  }
</style>

<script>
  export default {
    // name:"sub-menu",
    // props:{
    //   sideMenu:{
    //     type:Array,
    //     required:true,
    //     default:()=>[]
    //   }
    // },
    data() {
      return {
        isCollapse: false
      };
    },
    methods: {
      handleOpen(key, keyPath) {
        console.log(key, keyPath);
      },
      handleClose(key, keyPath) {
        console.log(key, keyPath);
      }
    }
  }
</script>